<!DOCTYPE html>
<!--
Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<html>
  <head>
    <script src="../../load.js"></script>
  </head>
  <body>
    <h1>Conditional Template</h1>

    <ul>
    <template id="example" bind>
      <span>Show?: <input type="checkbox" checked="{{ show }}"></span>
      <template bind if="{{ show }}">
      	<span>Yay! I'm shown</span>
      </template>
    </template>
    </ul>

    <script>
    document.addEventListener('DOMContentLoaded', function() {
      var t = document.getElementById('example');
      t.model = {
        show: true
      };

      // Needed to detect model changes if Object.observe
      // is not available in the JS VM.
      Platform.performMicrotaskCheckpoint();
    });
    </script>
  </body>
</html>
